import React from 'react';
import {connect} from 'react-redux';
import {Button, Form, Input,Select} from 'antd';

function IndexRecommend(props) {

    const info = props.record;
    const onFinish = (values) => {
        values.mId = info.autoId;
        values.nickName=info.nickName;
        values.realName= info.name;
        values.phone = info.mobile;

        props.addRecommend(values).then(res => {
            props.onCancel()
        })
    };

    return (
        <div>
            <Form
                name="IndexRecommend"
                labelCol={{span: 8}}
                wrapperCol={{span: 10}}
                onFinish={onFinish}
                autoComplete="off">
                <Form.Item
                    name="nickName"
                    label="用户昵称："
                >
                    <span>{info.nickName ? info.nickName : '暂无数据'}</span>
                </Form.Item>
                <Form.Item
                    name="name"
                    label="姓名："
                >
                    <span>{info.name ? info.name : '暂无数据'}</span>
                </Form.Item>

                <Form.Item
                    name="label"
                    label="发布技能："
                    rules={[
                        {
                            required: true,
                            message: '请选选择推荐技能',
                        },
                    ]}>
                    <Select showSearch placeholder='请选选择推荐技能'>
                        {info.cate.map((item) => (
                            <Select.Option key={item} value={item}>
                                {item}
                            </Select.Option>
                        ))}
                    </Select>
                </Form.Item>
                <Form.Item
                    name="sort"
                    label="排序："
                    rules={[{required: true, message: '请输入排序!'}]}
                >
                    <Input type="number" placeholder='正序排序'/>
                </Form.Item>
                <Form.Item style={{marginLeft: 200}}>
                    <Button type="primary" htmlType="submit">
                        提交
                    </Button>
                </Form.Item>
            </Form>
        </div>
    );
}

const mapState = state => ({
    ...state.users
});
const mapDispatch = dispatch => ({
    ...dispatch.users
});
export default connect(mapState, mapDispatch)(IndexRecommend);